<template>
	<div class="minW1060-auto bg-fff mt10">

		<el-breadcrumb separator-class="el-icon-arrow-right" class="mt20 ml30">
			<el-breadcrumb-item :to="{ path: '/vehicle' }">车辆管理</el-breadcrumb-item>
			<el-breadcrumb-item>车辆编辑</el-breadcrumb-item>
		</el-breadcrumb>

		<el-row :class="navBarFixed == true ? 'navBarWrap' :''" class="mt20">

			<el-col :span="16" style="transform: translate(3%, 25%);">

				<el-button class="stepBtn" @click="jump1('basic')" icon="el-icon-coordinate" circle="">基本信息
				</el-button>

				<el-button class="stepBtn" @click="jump1('photo')" icon="el-icon-picture-outline-round" circle="">车辆照片
				</el-button>

				<el-button class="stepBtn" @click="jump1('device')" icon="el-icon-s-opportunity" circle="">车载设备
				</el-button>

				<el-button class="stepBtn" @click="jump1('driver')" icon="el-icon-suitcase" circle="">关联驾驶员
				</el-button>

				<el-button class="stepBtn" @click="jump1('detail')" icon="el-icon-office-building" circle="">详细信息
				</el-button>

				<el-button class="stepBtn" @click="jump1('insurance')" icon="el-icon-office-building" circle="">保险信息
				</el-button>

				<el-button class="stepBtn" @click="jump1('owner')" icon="el-icon-office-building" circle="">所有者
				</el-button>

				<el-button class="stepBtn" @click="jump1('remark')" icon="el-icon-office-building" circle="">备注
				</el-button>

			</el-col>

			<el-col align="right" :span="8">
				<div class="dlblock-mb20 pr10 ml20">
					<el-button type="primary" @click="submitForm('vehicle')" style="transform: translate(-50%, 25%);">保存
					</el-button>
				</div>
				<div class="dlblock-mb20 pr10">
					<el-button type="danger" @click="resetForm('vehicle')" style="transform: translate(-50%, 25%);">
						重置
					</el-button>
				</div>
			</el-col>

			<div class="clearfix"></div>
		</el-row>

		<div class="pad20 ml10">

			<el-row :gutter="30">

				<el-form label-position="left" :rules="rules" label-width="80px" :model="vehicle" ref="vehicle">

					<el-row id="basic">
						<el-col :span="6" class="ml20">
							<h1>基本信息</h1>
						</el-col>
					</el-row>

					<el-row class="mt20">
						<el-col :span="6" :offset="1">
							<el-form-item label="车牌号" prop="no">
								<el-input v-model.trim="vehicle.no" placeholder="请输入车牌号"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="自编号" prop="code">
								<el-input v-model.trim="vehicle.code" placeholder="请输入车辆自编号"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="分组" prop="group">
								<el-cascader v-model="vehicle.group" :options="groups" :show-all-levels="false"
									:props="{value: 'id', label: 'name',  checkStrictly: true,expandTrigger: 'hover' }"
									style="width: 100%" clearable @change="clearRoute"></el-cascader>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="用途类型" prop="operation">
								<el-select v-model="vehicle.operation" clearable class="size-full">
									<el-option label="未设置" :value="0"></el-option>
									<el-option label="公交" :value="1"></el-option>
									<el-option label="校车" :value="2"></el-option>
									<el-option label="长途客运" :value="3"></el-option>
									<el-option label="出租车" :value="4"></el-option>
									<el-option label="网约车" :value="5"></el-option>
									<el-option label="货物运输" :value="6"></el-option>
									<el-option label="特种作业" :value="7"></el-option>
									<el-option label="公务车" :value="8"></el-option>
									<el-option label="租赁车" :value="9"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row>

						<el-col :span="6" :offset="1">
							<el-form-item label="车辆类型" prop="type">
								<el-select v-model="vehicle.type" clearable class="size-full">
									<el-option label="未设置" :value="0"></el-option>
									<el-option label="微型" :value="1"></el-option>
									<el-option label="轻型" :value="2"></el-option>
									<el-option label="中型" :value="3"></el-option>
									<el-option label="大型(重型)" :value="4"></el-option>
									<el-option label="特大型(特重型)" :value="5"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="燃料类型" prop="fuel">
								<el-select v-model="fuel" multiple collapse-tags style="width: 100% ;"
									placeholder="请选择">
									<el-option label="未设置" :value="0x00"></el-option>
									<el-option label="汽油" :value="0x01"></el-option>
									<el-option label="柴油" :value="0x02"></el-option>
									<el-option label="液化气" :value="0x04"></el-option>
									<el-option label="天燃气" :value="0x08"></el-option>
									<el-option label="煤气" :value="0x10"></el-option>
									<el-option label="燃料电池" :value="0x20"></el-option>
									<el-option label="动力电池" :value="0x40"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="线路" prop="route">
								<el-select v-model="vehicle.route" clearable class="size-full">
									<el-option :label="item.name" v-for="(item,index) in routes" :key="index"
										:value="item.id"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="支线" prop="line">
								<el-select v-model="vehicle.line" clearable class="size-full">
									<el-option :label="item.name" v-for="(item,index) in lines" :key="index"
										:value="item.id"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
					</el-row>


					<el-row>

						<el-col :span="6" :offset="1">
							<el-col :span="13">
								<el-form-item label="初始里程" prop="initCanMil">
									<el-input v-model.trim="vehicle.initCanMil" placeholder="CAN里程(单位:米)"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="9" :offset="2">
								<el-form-item label-width="0px" prop="initGpsMil">
									<el-input v-model.trim="vehicle.initGpsMil" placeholder="GPS里程(单位:米)"></el-input>
								</el-form-item>
							</el-col>

						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="启用状态" prop="state">
								<el-radio-group v-model="vehicle.state">
									<el-radio :label="0">已启用</el-radio>
									<el-radio :label="1">未启用</el-radio>
								</el-radio-group>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row id="photo">
						<el-col :span="6" class="ml20 mt20">
							<h1>车辆照片</h1>
						</el-col>
					</el-row>

					<el-row class="mt20">
						<el-col :offset="1">
							<el-upload :action="config.baseURL + '/api/web/file/upload/'" list-type="picture-card"
								:on-remove="handleRemove" :limit="5" :on-exceed="handleExceed" :show-file-list=true
								:file-list="fileList" :before-upload="beforeAvatarUpload"
								:on-success="handleAvatarSuccess">
								<i class="el-icon-plus"></i>
							</el-upload>
						</el-col>
					</el-row>

					<el-row id="device">
						<el-col :span="6" class="ml20 mt20">
							<h1>车载设备</h1>
						</el-col>
					</el-row>

					<el-row class="mt20">
						<el-col :offset="1">

							<el-col :span="4" class="mr20" v-for="(item,index) in selecteddeviceList"
								style="width: 233px">
								<div class="file_device">
									<img :src="getDeviceImg(item.type)">
									<i class="el-icon-close device_icon" @click="delDevice(item,index)"></i>
								</div>
								<p style="text-align: center;" v-if="item.type==0">未设置类型</p>
								<p style="text-align: center;" v-else-if="item.type==1">调度设备</p>
								<p style="text-align: center;" v-else-if="item.type==2">视频设备</p>
								<p style="text-align: center;" v-else-if="item.type==3">客流设备</p>
								<p style="text-align: center;" v-else-if="item.type==4">主动安全设备</p>
								<p style="text-align: center;" v-else-if="item.type==5">危险品检测设备</p>
								<p style="text-align: center;" v-else-if="item.type==6">公交卡刷卡机</p>
								<p style="text-align: center;">{{item.no}}</p>
							</el-col>

							<el-col :span="4">
								<div class="file_device_add" @click="dialogDeviceVisible = true">
									<img src="@/assets/imgs/device_add.png"
										style="width: 233px;height: 167px;margin: 0;cursor: pointer" />
								</div>
							</el-col>
						</el-col>
					</el-row>

					<!--弹出的设备对话框-->
					<el-dialog :visible.sync="dialogDeviceVisible" @open="queryDevice" width="50%">

						<el-row>
							<el-col>

								<div class="dlblock-mb20">
									<span class="pr5">设备号</span>
									<el-input v-model.trim="queryDeviceVal.deviceInfo" size="medium"
										placeholder="设备编号或手机号" style="width: 200px;" :maxlength="20" show-word-limit
										clearable></el-input>
								</div>

								<div class="dlblock-mb20">
									<span class="pr5 ml10">类型</span>
									<el-select v-model="queryDeviceVal.type" clearable>
										<el-option label="全部" value=""></el-option>
										<el-option label="未设置" value="0"></el-option>
										<el-option label="调度设备" value="1"></el-option>
										<el-option label="视频设备" value="2"></el-option>
										<el-option label="客流设备" value="3"></el-option>
										<el-option label="主动安全设备" value="4"></el-option>
										<el-option label="危险品检测设备" value="5"></el-option>
										<el-option label="公交卡刷卡机" value="6"></el-option>
									</el-select>
								</div>

								<div class="dlblock-mb20 pr10 ml20">
									<el-button type="primary" @click="queryDevice">搜索</el-button>
								</div>

							</el-col>
						</el-row>

						<el-row>
							<el-table class="my-table" :data="devices" height="350" v-loading="loading"
								:header-row-class-name="'my-table-header'" ref="myTable" border>
								<el-table-column align="center" prop="id" label="ID" v-if="false"></el-table-column>
								<el-table-column align="center" prop="no" label="设备编号">
									<template slot-scope="{row}">
										<p>{{row.device.no}}</p>
									</template>
								</el-table-column>
								<el-table-column align="center" prop="personCode" label="设备类型">
									<template slot-scope="{row}">
										<p v-if="row.device.type==0">未设置类型</p>
										<p v-else-if="row.device.type==1">调度设备</p>
										<p v-else-if="row.device.type==2">视频设备</p>
										<p v-else-if="row.device.type==3">客流设备</p>
										<p v-else-if="row.device.type==4">主动安全设备</p>
										<p v-else-if="row.device.type==5">危险品检测设备</p>
										<p v-else-if="row.device.type==6">公交卡刷卡机</p>
									</template>
								</el-table-column>
								<el-table-column align="center" prop="protocol" label="协议">
									<template slot-scope="{row}">
										<p v-if="row.device.protocol==0">未设置协议</p>
										<p v-else-if="row.device.protocol==1">JT808协议</p>
										<p v-else-if="row.device.protocol==2">Lanz私有协议</p>
										<p v-else-if="row.device.protocol==3">Lanz定制协议</p>
										<p v-else-if="row.device.protocol==4">海康扩展的JT808协议</p>
										<p v-else-if="row.device.protocol==5">青研扩展的JT808协议</p>
									</template>
								</el-table-column>

								<el-table-column align="center" prop="locator" label="定位装置">
									<template slot-scope="{row}">
										<p v-if="row.device.locator==0">无定位装置</p>
										<p v-else-if="row.device.locator==1">GPS定位系统</p>
										<p v-else-if="row.device.locator==2">北斗定位系统</p>
										<p v-else-if="row.device.locator==3">GPS和北斗定位系统</p>
									</template>
								</el-table-column>

								<el-table-column align="center" label="操作">
									<template slot-scope="{row}">
										<el-button type="text" v-if="row.state">已选择</el-button>
										<el-button type="text" @click="selectDevice(row)" v-else>选择</el-button>
									</template>
								</el-table-column>
							</el-table>
						</el-row>

						<!--分页控件-->
						<el-row :gutter="20" class="mt30">
							<el-col :span="12" :offset="6" align="center">
								<el-pagination background layout="total, prev, pager, next"
									:total="queryDeviceVal.total" :page-size="queryDeviceVal.size"
									:current-page="queryDeviceVal.page" @current-change="pageChangeDevice">
								</el-pagination>
							</el-col>
						</el-row>

					</el-dialog>


					<el-row id="driver">
						<el-col :span="6" class="ml20 mt20">
							<h1>关联驾驶员</h1>
						</el-col>
					</el-row>

					<el-row class="mt20">
						<el-col :offset="1">

							<el-col :span="4" v-for="(item,index) in selecteddriverList" class="mr20"
								style="width: 168px;">
								<div class="file_driver selectImg">
									<img :src="getDriverImg(item.image1)" style="border-radius: 5px;" />
									<i class="el-icon-close driver_icon" @click="delDriver(item,index)"></i>
								</div>
								<p style="text-align: center;">{{item.name}}</p>
								<p style="text-align: center;">{{item.cardNo}}</p>
							</el-col>

							<el-col :span="4">
								<div class="file_driver" @click="dialogDriverVisible = true">
									<img src="@/assets/imgs/driver_add.png" style="cursor: pointer" />
								</div>
							</el-col>

						</el-col>
					</el-row>

					<!--弹出的驾驶员对话框-->
					<el-dialog :visible.sync="dialogDriverVisible" @open="queryDriver" width="50%">

						<el-row>
							<el-col>

								<div class="dlblock-mb20">
									<span class="pr5">姓名</span>
									<el-input v-model.trim="queryEmpVal.name" size="medium" placeholder="姓名或拼音"
										style="width: 150px;" :maxlength="20" show-word-limit clearable></el-input>
								</div>

								<div class="dlblock-mb20">
									<span class="pr5 ml10">手机号</span>
									<el-input v-model.trim="queryEmpVal.phone" size="medium" placeholder="请输入手机号"
										style="width: 150px;" :maxlength="11" show-word-limit clearable></el-input>
								</div>

								<div class="dlblock-mb20">
									<span class="pr5 ml10">性别</span>
									<el-select v-model="queryEmpVal.gender" clearable style="width: 150px;">
										<!--                                        <el-option label="全部" value=""></el-option>-->
										<el-option label="未设置" value="0"></el-option>
										<el-option label="男" value="1"></el-option>
										<el-option label="女" value="2"></el-option>
									</el-select>
								</div>

								<div class="dlblock-mb20 pr10 ml20">
									<el-button type="primary" @click="queryDriver">搜索</el-button>
								</div>

							</el-col>
						</el-row>

						<el-row>
							<el-table class="my-table" :data="drivers" height="350" v-loading="loading"
								:header-row-class-name="'my-table-header'" ref="myTable" border>
								<el-table-column align="center" prop="id" label="ID" v-if="false"></el-table-column>
								<el-table-column align="center" prop="name" label="姓名">
									<template slot-scope="{row}">
										<p>{{row.driver.name}}</p>
									</template>
								</el-table-column>
								<el-table-column align="center" prop="personCode" label="性别">
									<template slot-scope="{row}">
										<p v-if="row.driver.gender==0">未设置</p>
										<p v-else-if="row.driver.gender==1">男</p>
										<p v-else-if="row.driver.gender==2">女</p>
									</template>
								</el-table-column>
								<el-table-column align="center" prop="deptName" label="部门">
									<template slot-scope="{row}">
										<p>{{row.driver.deptName}}</p>
									</template>
								</el-table-column>

								<el-table-column align="center" prop="age" label="年龄">
									<template slot-scope="{row}">
										<p>{{getAge(row.driver.dateOfBirth)}}</p>
									</template>
								</el-table-column>

								<el-table-column align="center" label="操作">
									<template slot-scope="{row}">
										<el-button type="text" v-if="row.state">已选择</el-button>
										<el-button type="text" @click="selectDriver(row)" v-else>选择</el-button>
									</template>
								</el-table-column>
							</el-table>
						</el-row>

						<!--分页控件-->
						<el-row :gutter="20" class="mt30">
							<el-col :span="12" :offset="6" align="center">
								<el-pagination background layout="total, prev, pager, next" :total="queryEmpVal.total"
									:page-size="queryEmpVal.size" :current-page="queryEmpVal.page"
									@current-change="pageChangeDriver">
								</el-pagination>
							</el-col>
						</el-row>

					</el-dialog>

					<el-row id="detail">
						<el-col :span="6" class="ml20 mt20">
							<h1>详细信息</h1>
						</el-col>
					</el-row>

					<el-row class="mt20">
						<el-col :span="6" :offset="1">
							<el-form-item label="载客人数" prop="capacity">
								<el-input v-model.trim="vehicle.capacity" placeholder="载客人数" type="text" show-word-limit :maxlength="10"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="整车质量" prop="curbWeight">
								<el-input v-model.trim="vehicle.curbWeight" placeholder="整车质量" type="text" show-word-limit :maxlength="10"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="载重量" prop="ratedWeight">
								<el-input v-model.trim="vehicle.ratedWeight" placeholder="单位:吨" type="text" show-word-limit :maxlength="10"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="座位数" prop="seatCount">
								<el-input v-model.trim="vehicle.seatCount" placeholder="座位数" type="text" show-word-limit :maxlength="10"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="外廓尺寸">
								<el-input v-model.trim="vehicle.size" placeholder="外廓尺寸" type="text" show-word-limit :maxlength="10"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="车身颜色" prop="bodyColor" >
								<el-input v-model.trim="vehicle.bodyColor" placeholder="车身颜色" type="text" show-word-limit :maxlength="18"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="发动机号" prop="engine">
								<el-input v-model.trim="vehicle.engine" placeholder="发动机号" type="text" show-word-limit :maxlength="18"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="车架号" prop="fameNo">
								<el-input v-model.trim="vehicle.fameNo" placeholder="车架号" type="text" show-word-limit :maxlength="18"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="行驶证号" prop="drivingNo">
								<el-input v-model.trim="vehicle.drivingNo" placeholder="行驶证号" type="text" show-word-limit :maxlength="18"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="购置日期" prop="buyDate">
								<el-date-picker v-model="vehicle.buyDate" type="date" placeholder="选择日期"
									format="yyyy 年 MM 月 dd 日" value-format="yyyy-MM-dd" style="width: 100%;">
								</el-date-picker>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="注册日期" prop="regDate">
								<el-date-picker v-model="vehicle.regDate" type="date" placeholder="选择日期"
									format="yyyy 年 MM 月 dd 日" value-format="yyyy-MM-dd" style="width: 100%;">
								</el-date-picker>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="报废日期" prop="discardDate">
								<el-date-picker v-model="vehicle.discardDate" type="date" placeholder="选择日期"
									format="yyyy 年 MM 月 dd 日" value-format="yyyy-MM-dd" style="width: 100%;">
								</el-date-picker>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="车门数" prop="doors">
								<el-select v-model="vehicle.doors" clearable class="size-full">
									<el-option label="1" :value="1"></el-option>
									<el-option label="2" :value="2"></el-option>
									<el-option label="3" :value="3"></el-option>
									<el-option label="4" :value="4"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="层数" prop="storey">
								<el-select v-model="vehicle.storey" clearable class="size-full">
									<el-option label="1" :value="1"></el-option>
									<el-option label="2" :value="2"></el-option>
									<el-option label="3" :value="3"></el-option>
									<el-option label="4" :value="4"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="车牌类型" prop="licenseType">
								<el-select v-model="vehicle.licenseType" clearable class="size-full">
									<el-option label="未设置" :value="0"></el-option>
									<el-option label="黄底黑字" :value="10"></el-option>
									<el-option label="黄底黑字（挂）" :value="11"></el-option>
									<el-option label="黄底黑字（学）" :value="12"></el-option>
									<el-option label="蓝底白字" value="20"></el-option>
									<el-option label="绿底黑字（新能源）" :value="30"></el-option>
									<el-option label="绿底白字（民航）" :value="31"></el-option>
									<el-option label="白底黑字（警）" :value="40"></el-option>
									<el-option label="白底黑字（WJ）" :value="41"></el-option>
									<el-option label="白底黑字（军）" :value="42"></el-option>
									<el-option label="黑底白字（使）" :value="50"></el-option>
									<el-option label="黑底白字（领）" :value="51"></el-option>
									<el-option label="黑底白字（港）" :value="52"></el-option>
									<el-option label="黑底白字（澳）" :value="53"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="排放标准" prop="discharge">
								<el-select v-model="vehicle.discharge" clearable class="size-full">
									<el-option label="未设置" :value="0"></el-option>
									<el-option label="国I" :value="1"></el-option>
									<el-option label="国II" :value="2"></el-option>
									<el-option label="国III" :value="3"></el-option>
									<el-option label="国IV" :value="4"></el-option>
									<el-option label="国V" :value="5"></el-option>
									<el-option label="国VI - A" :value="6"></el-option>
									<el-option label="国VI - B" :value="7"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-col :span="10">
								<el-form-item label="气缸信息" prop="arrange">
									<el-select v-model="vehicle.arrange" clearable class="size-full">
										<el-option label="未设置" :value="0"></el-option>
										<el-option label="直列" :value="1"></el-option>
										<el-option label="V型排列" :value="2"></el-option>
										<el-option label="水平对置" :value="3"></el-option>
										<el-option label="星型排列" :value="4"></el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="6" :offset="1">
								<el-form-item label-width="0px" prop="cylinders">
									<el-input v-model.trim="vehicle.cylinders" placeholder="气缸数" type="text" show-word-limit :maxlength="10"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="6" :offset="1">
								<el-select v-model="vehicle.turbo" clearable class="size-full">
									<el-option label="无涡轮增压" :value="0"></el-option>
									<el-option label="涡轮增压" :value="1"></el-option>
									<el-option label="机械增压" :value="2"></el-option>
									<el-option label="两者兼有" :value="3"></el-option>
								</el-select>
							</el-col>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-col :span="11">
								<el-form-item label="排量" prop="displacement">
									<el-input v-model.trim="vehicle.displacement" placeholder="单位:升" type="text" show-word-limit :maxlength="10"></el-input>
								</el-form-item>
							</el-col>

							<el-col :span="11" :offset="2">
								<el-form-item label="压缩比" prop="compression">
									<el-input v-model.trim="vehicle.compression" placeholder="如14:1为14" type="text" show-word-limit :maxlength="10"></el-input>
								</el-form-item>
							</el-col>
						</el-col>
					</el-row>

					<el-row>

						<el-col :span="6" :offset="1">
							<el-col :span="11">
								<el-form-item label="0-100加速" prop="acceleration">
									<el-input v-model.trim="vehicle.acceleration" placeholder="单位:秒" type="text" show-word-limit :maxlength="10"></el-input>
								</el-form-item>
							</el-col>

							<el-col :span="11" :offset="2">
								<el-form-item label="燃油标号" prop="roz">
									<el-select v-model="vehicle.roz" clearable class="size-full">
										<el-option label="未设置" :value="0"></el-option>
										<el-option label="93#汽油" :value="93"></el-option>
										<el-option label="95#汽油" :value="95"></el-option>
										<el-option label="98#汽油" :value="98"></el-option>
										<el-option label="0#柴油" :value="1"></el-option>
										<el-option label="-30#柴油" :value="-30"></el-option>
									</el-select>
								</el-form-item>
							</el-col>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-col :span="11">
								<el-form-item label="轴数" prop="axleCount">
									<el-input v-model.trim="vehicle.axleCount" placeholder="轴数" type="text" show-word-limit :maxlength="10"></el-input>
								</el-form-item>
							</el-col>

							<el-col :span="11" :offset="2">
								<el-form-item label="轴重" prop="axleLoad">
									<el-input v-model.trim="vehicle.axleLoad" placeholder="单位:吨" type="text" show-word-limit :maxlength="10"></el-input>
								</el-form-item>
							</el-col>
						</el-col>
					</el-row>

					<el-row id="insurance">
						<el-col :span="6" class="ml20 mt20">
							<h1>保险信息</h1>
						</el-col>
					</el-row>

					<el-row class="mt20">
						<el-col :span="6" :offset="1">
							<el-form-item label="年审到期" prop="inspect">
								<el-date-picker v-model="inspect" type="date" format="yyyy 年 MM 月 dd 日"
									value-format="yyyy-MM-dd" placeholder="选择日期">
								</el-date-picker>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="强险到期" prop="compulsoryDate">
								<el-date-picker v-model="compulsoryDate" type="date" format="yyyy 年 MM 月 dd 日"
									value-format="yyyy-MM-dd" placeholder="选择日期">
								</el-date-picker>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="三责到期" prop="liabilityDate">
								<el-date-picker v-model="liabilityDate" type="date" format="yyyy 年 MM 月 dd 日"
									value-format="yyyy-MM-dd" placeholder="选择日期">
								</el-date-picker>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="三责额度" prop="liabilityClaims">
								<el-input v-model.trim="vehicle.liabilityClaims" placeholder="单位:万元" type="text" show-word-limit :maxlength="10"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="车损到期" prop="damageDate">
								<el-date-picker v-model="damageDate" type="date" format="yyyy 年 MM 月 dd 日"
									value-format="yyyy-MM-dd" placeholder="选择日期">
								</el-date-picker>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="车损额度" prop="damageClaims">
								<el-input v-model.trim="vehicle.damageClaims" placeholder="单位:万元" type="text" show-word-limit :maxlength="10"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="附加险" prop="medigaps">
								<el-checkbox-group v-model="medigaps">
									<el-checkbox label="0x01">责任险</el-checkbox>
									<el-checkbox label="0x02">抢盗险</el-checkbox>
									<el-checkbox label="0x04">划痕险</el-checkbox>
									<el-checkbox label="0x08">玻璃险</el-checkbox>
									<el-checkbox label="0x10">自燃险</el-checkbox>
									<el-checkbox label="0x20">涉水险</el-checkbox>
								</el-checkbox-group>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="车上人员责任险额度" prop="personClaims" label-width="85px" >
								<el-input v-model.trim="vehicle.personClaims" placeholder="单位:万元" type="text" show-word-limit :maxlength="10"></el-input>
							</el-form-item>
						</el-col>
					</el-row>


					<el-row id="owner">
						<el-col :span="6" class="ml20 mt20">
							<h1>所有者</h1>
						</el-col>
					</el-row>

					<el-row class="mt20">
						<el-col :span="6" :offset="1">
							<el-form-item label="所有者" prop="ownerName">
								<el-input v-model.trim="vehicle.ownerName" placeholder="所有者" type="text" show-word-limit :maxlength="18"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="公司名称" prop="ownerCompany">
								<el-input v-model.trim="vehicle.ownerCompany" placeholder="公司名称" type="text" show-word-limit :maxlength="20"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="证件类型" prop="ownerCertType">
								<el-select v-model="vehicle.ownerCertType" clearable class="size-full">
									<el-option label="未设置" :value="0"></el-option>
									<el-option label="营业执照" :value="1"></el-option>
									<el-option label="居民身份证" :value="2"></el-option>
									<el-option label="士官证" :value="3"></el-option>
									<el-option label="学生证" :value="4"></el-option>
									<el-option label="驾驶证" :value="5"></el-option>
									<el-option label="护照" :value="6"></el-option>
									<el-option label="港澳通行证" :value="7"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="证件号码" prop="ownerCertNo">
								<el-input v-model.trim="vehicle.ownerCertNo" placeholder="证件号码" type="text" show-word-limit :maxlength="18"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="邮政编码" prop="ownerPostcode">
								<el-input v-model.trim="vehicle.ownerPostcode" placeholder="邮政编码" type="text" show-word-limit :maxlength="6"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="办公电话" prop="ownerTel1">
								<el-input v-model.trim="vehicle.ownerTel1" placeholder="办公电话" type="text" show-word-limit :maxlength="11"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="通信地址" prop="ownerAddress">
								<el-input v-model.trim="vehicle.ownerAddress" placeholder="通信地址" type="text" show-word-limit :maxlength="20"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="家庭电话" prop="ownerTel2">
								<el-input v-model.trim="vehicle.ownerTel2" placeholder="家庭电话" type="text" show-word-limit :maxlength="11"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="移动电话" prop="ownerTel3">
								<el-input v-model.trim="vehicle.ownerTel3" placeholder="移动电话" type="text" show-word-limit :maxlength="11"></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="6" :offset="1">
							<el-form-item label="工作单位" prop="ownerCompany">
								<el-input v-model.trim="vehicle.ownerCompany" placeholder="工作单位" type="text" show-word-limit :maxlength="20"></el-input>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row>
						<el-col :span="6" :offset="1">
							<el-form-item label="出生日期" prop="ownerDateOfBirth">
								<el-date-picker v-model="vehicle.ownerDateOfBirth" type="date" format="yyyy 年 MM 月 dd 日"
									value-format="yyyy-MM-dd" placeholder="选择日期">
								</el-date-picker>
							</el-form-item>
						</el-col>
					</el-row>

					<el-row id="remark">
						<el-col :span="6" class="ml20 mt20">
							<h1>备注</h1>
						</el-col>
					</el-row>

					<el-row class="mt20">
						<el-col :span="13" :offset="1">
							<el-input type="textarea" v-model="vehicle.remarks" :rows="5"></el-input>
						</el-col>
					</el-row>

				</el-form>

			</el-row>

		</div>

	</div>
</template>

<script>
	import {
		saveVehicle,
		getDeviceInfo,
		getPersons,
		blindDriver,
		delDriver,
		delDevice,
		blindDevice,
		getGroupTree,
		findRouteByGroup,
		findLineByRoute,
	} from '@/api';
	import config from '@/utils/config';
	import {
		myDate1,
		jump
	} from "../../../../utils/common";

	export default {
		name: 'index1',
		data() {

			//包含小数的数字校验
			var valiNumberPass1 = (rule, value, callback) => {
				let reg = /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g;
				if (value == undefined || value == '') {
					callback();
				} else if (!reg.test(value)) {
					callback(new Error('请输入数字'));
				} else {
					callback();
				}
			};

			//正整数校验
			var valiNumberPass2 = (rule, value, callback) => {
				let reg = /^[+]{0,1}(\d+)$/g;
				if (value == undefined || value == '') {
					callback();
				} else if (!reg.test(value)) {
					callback(new Error('请输入正整数'));
				} else {
					callback();
				}
			};

			return {
				config,
				loading: false,

				navBarFixed: false,

				//对话框变量
				dialogImageUrl: '',
				dialogVisible: false,
				dialogDeviceVisible: false,
				dialogDriverVisible: false,

				//分组 线路 支线选择
				groups: [],
				routes: [],
				lines: [],

				//车辆信息
				vehicle: {
					no: '',
					route: '',
					line: '',
					images: [],
					driverIds: [],
					deviceIds: [],
					fuel: '',
					medigaps: '',
					inspect: '',
					compulsoryDate: '',
					liabilityDate: '',
					damageDate: '',
				},

				//fuel
				fuel: [],

				//medigaps
				medigaps: [],

				//inspect
				inspect: '',

				//compulsoryDate
				compulsoryDate: '',

				//liabilityDate
				liabilityDate: '',

				//damageDate
				damageDate: '',

				//上传的车辆图片
				vehicleImgs: [],

				fileList: [],

				//照片修改标志
				imgFlag: false,

				//设备
				devices: [],
				selecteddeviceList: [],

				//驾驶员
				drivers: [],
				selecteddriverList: [],

				//设备查询变量
				queryDeviceVal: {
					type: '',
					deviceInfo: '',
					isBlind: 1,
					page: 1,
					size: 10,
					total: 0
				},

				//人员查询变量
				queryEmpVal: {
					name: '',
					phone: '',
					gender: '',
					type: 2,
					page: 1,
					size: 5,
					total: 0
				},

				//验证规则
				rules: {
					no: [{
						required: true,
						message: '请输入正确的车牌号',
						trigger: 'blur',
						max:20
					}, ],
					code: [{
						required: true,
						message: '请输入正确的自编号',
						trigger: 'blur',
						max:20
					}, ],
					group: [{
						required: true,
						message: '分组不能为空',
						trigger: 'blur'
					}, ],
					// menu: [
					//     {required: true, message: '线路不能为空', trigger: 'blur'},
					// ],
					// fuel: [
					//     {required: true, message: '燃料类型不能为空', trigger: 'blur'},
					// ],
					type: [{
						required: true,
						message: '车辆类型不能为空',
						trigger: 'blur'
					}, ],
					operation: [{
						required: true,
						message: '用途类型不能为空',
						trigger: 'blur'
					}, ],

					initCanMil: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					initGpsMil: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					capacity: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					curbWeight: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					ratedWeight: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					seatCount: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					// size: [
					//     {validator: valiNumberPass1, trigger: 'blur'},
					// ],
					cylinders: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					displacement: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					compression: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					acceleration: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					axleCount: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					axleLoad: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					liabilityClaims: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					damageClaims: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					personClaims: [{
						validator: valiNumberPass2,
						trigger: 'blur'
					}, ],
					/*ownerCompany:[{
						trigger: 'blur',
						max:20,
						message:'请输入正确的信息'
					}]*/
				},
			};
		},
		watch: {

			//根据所选分组获取相关线路信息
			'vehicle.group': function() {
				if (this.vehicle.group.hasOwnProperty('length') == false) {
					findRouteByGroup(this.vehicle.group != 0 ? this.vehicle.group : -1).then(res => {
						this.routes = res.data
					})
				} else {
					findRouteByGroup(this.vehicle.group != 0 ? this.vehicle.group[this.vehicle.group.length - 1] : -1)
						.then(res => {
							this.routes = res.data
						})
				}
			},
			'vehicle.route': function() {
				if (this.vehicle.route.hasOwnProperty('length') == false) {
					findLineByRoute(this.vehicle.route != 0 ? this.vehicle.route : -1).then(res => {
						this.lines = res.data
						console.log(this.lines)
					})
				} else {
					findLineByRoute(this.vehicle.route != 0 ? this.vehicle.route[this.vehicle.route.length - 1] : -1)
						.then(res => {
							this.lines = res.data
							console.log(this.lines)
						})
				}
			}
		},
		methods: {

			//锚点跳转
			jump1(data) {
				jump(data)
			},

			//年龄
			getAge(date) {
				if (date != null) {
					var brith = myDate1(new Date(date)).substr(0, 4)
					var now = myDate1(new Date()).substr(0, 4)
					return now - brith
				} else {
					return '空'
				}
			},

			// 获取当前权限下所有分组
			getGroupTreeFn() {
				getGroupTree({}).then(res => {
					this.groups = res.data.children
				})
			},

			//根据所选分组获取相关线路信息
			clearRoute() {
				this.vehicle.route = ''
			},

			//移除照片
			handleRemove(file, fileList) {
				this.vehicleImgs = fileList
				this.imgFlag = true
			},

			//照片上传成功回调函数
			handleAvatarSuccess(res, file, fileList) {
				this.vehicleImgs = fileList
				this.imgFlag = true
			},

			//上传失败方法
			handleExceed() {
				this.$message.warning("最多可上传5张图片");
			},

			//上传前的校验
			beforeAvatarUpload(file) {
				const isJPG = file.type === 'image/jpeg';
				const isLt2M = file.size / 1024 / 1024 < 2;

				if (!isJPG) {
					this.$message.error('上传头像图片只能是 JPG 格式!');
				}
				if (!isLt2M) {
					this.$message.error('上传头像图片大小不能超过 2MB!');
				}
				return isJPG && isLt2M;
			},

			//查询设备
			queryDevice() {
				getDeviceInfo(this.queryDeviceVal).then(res => {
					this.devices = []
					if (res != null && res.code == 200) {
						var a = res.data.list
						var b = this.selecteddeviceList
						var c = []
						if (b.length > 0) {
							for (var m = 0; m < b.length; m++) {
								c.push(b[m].id)
							}
						}
						for (var i = 0; i < a.length; i++) {
							if (c.length > 0) {
								if (c.indexOf(a[i].id) == -1) {
									this.devices.push({
										device: a[i],
										state: false
									})
								} else {
									this.devices.push({
										device: a[i],
										state: true
									})
								}
							} else {
								this.devices.push({
									device: a[i],
									state: false
								})
							}
						}
						//总条数
						this.queryDeviceVal.total = res.data.count
					}
				})
			},

			// 设备分页查询
			pageChangeDevice(val) {
				this.queryDeviceVal.page = val
				this.queryDevice()
			},

			//选择设备
			selectDevice(item) {
				//判断是新增还是编辑页面
				if (this.vehicle.id != undefined) {
					//编辑页面直接新增
					this.blindDevice(item.device)
					this.queryDevice()
				} else {
					//新增页面存到数组里保存时一起新增
					this.selecteddeviceList.push(item.device)
					this.vehicle.deviceIds.push(item.device.id)
					this.queryDevice()
				}
			},

			//设备照片
			getDeviceImg(data) {
				if (data == 0) {
					return require('../../../../assets/imgs/dd_default.jpg')
				} else if (data == 1) {
					return require('../../../../assets/imgs/dd_default.jpg')
				} else if (data == 2) {
					return require('../../../../assets/imgs/sp_default.jpg')
				} else if (data == 3) {
					return require('../../../../assets/imgs/kl_default.jpg')
				} else if (data == 4) {
					return require('../../../../assets/imgs/aq_default.jpg')
				} else if (data == 5) {
					return require('../../../../assets/imgs/wxp_default.jpg')
				} else if (data == 6) {
					return require('../../../../assets/imgs/sk_default.jpg')
				}
			},

			//获取驾驶员信息
			queryDriver() {
				this.drivers = []
				getPersons(this.queryEmpVal).then(res => {
					var a = res.data.list
					var b = this.selecteddriverList
					var c = []
					if (b.length > 0) {
						for (var m = 0; m < b.length; m++) {
							c.push(b[m].id)
						}
					}
					for (var i = 0; i < a.length; i++) {
						if (c.length > 0) {
							if (c.indexOf(a[i].id) == -1) {
								this.drivers.push({
									driver: a[i],
									state: false
								})
							} else {
								this.drivers.push({
									driver: a[i],
									state: true
								})
							}
						} else {
							this.drivers.push({
								driver: a[i],
								state: false
							})
						}
					}
					//总条数
					this.queryEmpVal.total = res.data.count
				})
			},

			//驾驶员分页
			pageChangeDriver(val) {
				this.queryEmpVal.page = val
				this.queryDriver()
			},

			//驾驶员照片
			getDriverImg(data) {
				if (data != null && data != '') {
					return window.gConfig.uploadURL + data
				} else {
					return require('../../../../assets/imgs/user_default.png')
				}
			},

			//选择驾驶员
			selectDriver(item) {
				//判断是新增还是编辑页面
				if (this.vehicle.id != undefined) {
					//编辑页面直接删除
					this.blindDriver(item.driver)
					this.queryDriver()
				} else {
					//新增页面存到数组里保存时一起删除
					this.selecteddriverList.push(item.driver)
					this.vehicle.driverIds.push(item.driver.id)
					this.queryDriver()
				}
			},

			//删除绑定的驾驶员信息
			delDriver(item, index) {
				if (this.vehicle.id != undefined) {
					delDriver({
						vehicle: this.vehicle.id,
						emp: item.id
					}).then(res => {
						if (res.code == 200) {
							this.selecteddriverList.splice(index, 1)
						}
					})
				} else {
					this.selecteddriverList.splice(index, 1)
				}
			},

			//单个绑定驾驶员信息
			blindDriver(item) {
				blindDriver({
					vehicle: this.vehicle.id,
					emp: item.id
				}).then(res => {
					if (res.code == 200) {
						this.selecteddriverList.push(item)
					}
				})
			},

			//删除绑定的设备信息
			delDevice(item, index) {

				if (this.vehicle.id != undefined) {
					delDevice({
						device: item.id
					}).then(res => {
						if (res.code == 200) {
							this.selecteddeviceList.splice(index, 1)
						}
					})
				} else {
					this.selecteddeviceList.splice(index, 1)
				}
			},

			//单个绑定设备信息
			blindDevice(item) {
				blindDevice({
					vehicle: this.vehicle.id,
					device: item.id
				}).then(res => {
					if (res.code == 200) {
						this.selecteddeviceList.push(item)
					}
				})
			},

			//数组并运算
			sum(arr) {
				var s = 0;
				for (var i = arr.length - 1; i >= 0; i--) {
					s = s | arr[i];
				}
				return s;
			},

			//提交表单
			submitForm(formName) {

				if (this.vehicle.group.hasOwnProperty('length')) {
					if (this.vehicle.group.length != 0) {
						this.vehicle.group = this.vehicle.group[this.vehicle.group.length - 1]
					}
				}
				this.$refs[formName].validate((valid) => {
					if (valid) {
						this.vehicle.fuel = this.sum(this.fuel)
						this.vehicle.medigaps = this.sum(this.medigaps)

						if (this.inspect.length != 0) {
							this.vehicle.inspect = this.toInt(this.inspect)
						}
						if (this.compulsoryDate.length != 0) {
							this.vehicle.compulsoryDate = this.toInt(this.compulsoryDate)
						}
						if (this.liabilityDate.length != 0) {
							this.vehicle.liabilityDate = this.toInt(this.liabilityDate)
						}
						if (this.damageDate.length != 0) {
							this.vehicle.damageDate = this.toInt(this.damageDate)
						}

						//车辆照片
						if (this.imgFlag) {
							this.vehicle.images = []
							for (let i = 0; i < this.vehicleImgs.length; i++) {
								if (this.vehicleImgs[i].hasOwnProperty('response')) {
									this.vehicle.images.push(this.vehicleImgs[i].response.data)
								} else {
									if (this.vehicleImgs[i].url.indexOf('http') != -1) {
										this.vehicle.images.push(this.vehicleImgs[i].url.split(window.gConfig
											.uploadURL)[1])
									} else {
										this.vehicle.images.push(this.vehicleImgs[i].url)
									}
								}
							}
						}

						if (this.$route.query.vehicle != null) {
							this.vehicle.devices = null
							this.vehicle.drivers = null
						}

						//保存车辆
						saveVehicle(this.vehicle).then(res => {
							if (res.code == 200) {
								this.$message.success("保存成功")
								this.$router.push('/vehicle')
								this.$store.dispatch('tagsView/delView', {
									path: '/vehicle/edit'
								})
							}
						})
					} else {
						this.$message.error("信息填写有误")
						return false;

					}
				});
			},

			//重置
			resetForm(formName) {
				this.$refs[formName].resetFields();
			},

			//导航条效果
			watchScroll() {
				var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
				//  当滚动超过 50 时，实现吸顶效果
				if (scrollTop > 120) {
					this.navBarFixed = true
				} else {
					this.navBarFixed = false
				}
			},

			//保险日期
			insuranceDate(str) {
				if (str.length == 4) {
					return new Date().getFullYear() + '-' + str.substr(0, 2) + '-' + str.substr(2, 4)
				} else if (str.length == 3) {
					return new Date().getFullYear() + '-0' + str.substr(0, 1) + '-' + str.substr(1, 3)
				} else {
					return myDate1(new Date())
				}
			},

			//日期转int
			toInt(str) {
				var a = []
				a = str.split("-")
				return a[1] + a[2]
			}

		},

		mounted() {
			this.getGroupTreeFn()
			this.vehicleImgs = []
			if (this.$route.query.vehicle != null) {
				this.vehicle = this.$route.query.vehicle
				this.selecteddeviceList = this.vehicle.devices
				this.selecteddriverList = this.vehicle.drivers

				//燃料类型
				if ((this.vehicle.fuel & 0x00) != 0) {
					this.fuel.push(0x00)
				}
				if ((this.vehicle.fuel & 0x01) != 0) {
					this.fuel.push(0x01)
				}
				if ((this.vehicle.fuel & 0x02) != 0) {
					this.fuel.push(0x02)
				}
				if ((this.vehicle.fuel & 0x04) != 0) {
					this.fuel.push(0x04)
				}
				if ((this.vehicle.fuel & 0x08) != 0) {
					this.fuel.push(0x08)
				}
				if ((this.vehicle.fuel & 0x10) != 0) {
					this.fuel.push(0x10)
				}
				if ((this.vehicle.fuel & 0x20) != 0) {
					this.fuel.push(0x20)
				}
				if ((this.vehicle.fuel & 0x40) != 0) {
					this.fuel.push(0x40)
				}

				//附加险
				if ((this.vehicle.medigaps & 0x00) != 0) {
					this.medigaps.push("0x00")
				}
				if ((this.vehicle.medigaps & 0x01) != 0) {
					this.medigaps.push("0x01")
				}
				if ((this.vehicle.medigaps & 0x02) != 0) {
					this.medigaps.push("0x02")
				}
				if ((this.vehicle.medigaps & 0x04) != 0) {
					this.medigaps.push("0x04")
				}
				if ((this.vehicle.medigaps & 0x08) != 0) {
					this.medigaps.push("0x08")
				}
				if ((this.vehicle.medigaps & 0x10) != 0) {
					this.medigaps.push("0x10")
				}
				if ((this.vehicle.medigaps & 0x20) != 0) {
					this.medigaps.push("0x20")
				}

				//保险日期
				if (this.vehicle.inspect != 0) {
					this.inspect = this.insuranceDate(this.vehicle.inspect.toString())
				}
				if (this.vehicle.compulsoryDate != 0) {
					this.compulsoryDate = this.insuranceDate(this.vehicle.compulsoryDate.toString())
				}
				if (this.vehicle.liabilityDate != 0) {
					this.liabilityDate = this.insuranceDate(this.vehicle.liabilityDate.toString())
				}
				if (this.vehicle.damageDate != 0) {
					this.damageDate = this.insuranceDate(this.vehicle.damageDate.toString())
				}

				//照片回显
				for (var i = 0; i < this.vehicle.images.length; i++) {
					if (this.vehicle.images[i] != null && this.vehicle.images[i] != '') {
						var url = window.gConfig.uploadURL + this.vehicle.images[i]
						this.fileList.push({
							'url': url
						})
					}
				}
			}

			// 事件监听滚动条
			window.addEventListener('scroll', this.watchScroll)
		}
	}
</script>

<style scoped>
	.size-full {
		width: 100%;
	}

	.el-date-editor.el-input,
	.el-date-editor.el-input__inner {
		width: 100%;
	}

	.navBarWrap {
		position: fixed;
		top: 74px;
		right: 0;
		left: 200px;
		z-index: 100;
		background-color: #ffffff;
		color: #000000;
		border-bottom: 1px solid #dcdfe6;
	}

	.file_driver,
	.file_device {
		position: relative;
	}

	element.style {
		z-index: unset !important;
	}

	.file_driver img {
		width: 168px;
		height: 167px;
		margin: 0;
		display: block;
	}

	.selectImg {
		border: #DCDFE6 solid 1px;
		border-radius: 5px;
	}

	.file_device img {
		width: 233px;
		height: 167px;
	}

	.device_icon {
		font-size: 20px;
		display: block;
		position: absolute;
		left: 212px;
		top: 2px;
		color: #000000;
		cursor: pointer;
	}

	.driver_icon {
		font-size: 20px;
		display: block;
		position: absolute;
		left: 147px;
		top: 2px;
		color: #000000;
		cursor: pointer;
	}
</style>
